<template>
  <div>
    <el-dialog :title="title" :visible.sync="openOutOrin" width="60%">
      <el-form ref="formOutin" :model="itemShow" label-width="220px">
        <el-form-item v-if="itemShow&&itemShow.component_name" label="资产组件名称">
          {{ itemShow.component_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.model_name" label="型号">
          {{ itemShow.model_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.asset_name&&assetType !== 'license'" label="资产名称">
          {{ itemShow.asset_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.name" label="资产名称">
          <el-input v-model="itemShow.name" :disabled="true" placeholder="请输入资产名称" />
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.asset_name&&assetType === 'license'" label="许可证名称">
          {{ itemShow.asset_name }}
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.serial&&assetType === 'license'" label="许可证序列号">
          {{ itemShow.serial }}
        </el-form-item>
        <el-form-item v-if="itemShow&&assetType === 'component'" label="归还数量">
          <el-input v-model="itemShow.qty" placeholder="请输入归还数量" />
        </el-form-item>
        <el-form-item v-if="itemShow&&itemShow.status" label="状态选择">
          <el-select v-model="itemShow.status" :disabled="true" placeholder="请选择资产状态" clearable size="small">
            <el-option
              v-for="dict in assetStatus"
              :key="dict.dictValue"
              :label="dict.dictLabel"
              :value="dict.dictValue"
            />
          </el-select>
        </el-form-item>
        <el-form-item v-if="assetType === 'asset'" label="选择位置">
          <ChooseLocation @commitLocationMethod="commitLocationMethod"></ChooseLocation>
        </el-form-item>
        <el-form-item v-if="assetType === 'asset'||assetType === 'accessory'" label="登记日期" prop="checkout_date">
          <el-date-picker
            v-model="itemShow.check_datetime"
            clearable
            size="small"
            type="date"
            value-format="yyyy-MM-dd"
            placeholder="选择登记日期"
          >
          </el-date-picker>
        </el-form-item>
        <el-form-item label="归还备注">
          <el-input v-model="itemShow.checkin_notes" type="textarea" placeholder="请输入内容" />
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button type="primary" @click="submitFormOutIn">确 定</el-button>
        <el-button @click="close">取 消</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { CheckinProd } from "@/api/vadmin/basic/base";
import ChooseLocation from "@/views/components/ChooseLocation";

export default {
  name: "Too",
  components: { ChooseLocation },
  props: {
    title: {
      type: String,
      default: "归还"
    },
    assetType: {
      type: String,
      defalut: ""
    },
    tooShow: {
      type: Object,
      default: {}
    }
  },
  data: function() {
    return {
      openOutOrin: false,
      itemShow: {
        name: "",
        model_name: "",
        status: "",
        checkin_notes: "",
        qty: 0,
        check_datetime: "",
        location: ""
      },
      assetStatus: [],
      locationList: []
    };
  },
  computed: {},
  watch: {
    tooShow: {
      handler(val) {
        if (val.name) {
          this.itemShow.name = val.name;
        }
        if (val.model_name) {
          this.itemShow.model_name = val.model_name;
        }
        if (val.status) {
          this.itemShow.status = val.status;
        }
        if (val.component_name) {
          this.itemShow.component_name = val.component_name;
        }
        if (val.asset_name) {
          this.itemShow.asset_name = val.asset_name;
        }
        if (val.qty) {
          this.itemShow.qty = val.qty;
        }
        if (val.serial) {
          this.itemShow.serial = val.serial;
        }
      }
    }
  },
  created() {
  },
  activated() {
  },
  mounted() {
    this.getDicts("asset_status").then(response => {
      this.assetStatus = response.data;
    });
  },
  methods: {
    commitLocationMethod(val) {
      this.itemShow.location = val;
    },
    open() {
      this.openOutOrin = true;
    },
    close() {
      this.openOutOrin = false;
      this.resetForm("formOutin");
      if (this.assetType === "component") {
        this.itemShow.checkin_notes = "";
      }
    },
    submitFormOutIn() {
      let rq = null;
      switch (this.assetType) {
          case "asset":
            rq = {
              record_id: this.tooShow.id,
              asset_type: this.assetType,
              notes: this.itemShow.checkin_notes,
              check_datetime: this.itemShow.check_datetime,
              location: this.itemShow.location,
              qty: "1"
            };
            break;
          case "component":
            if (this.itemShow.qty > this.tooShow.qty) {
              this.$message({
                message: "归还数量必须小于或者等于借出数量：" + this.tooShow.qty,
                type: "error"
              });
              return;
            } else if (this.itemShow.qty === 0) {
              this.$message({
                message: "归还数量必须大于零",
                type: "error"
              });
              return;
            }
            rq = {
              record_id: this.tooShow.record_id,
              asset_type: this.assetType,
              notes: this.itemShow.checkin_notes,
              qty: this.itemShow.qty
            };
            break;
          case "accessory":
            rq = {
              record_id: this.tooShow.record_id,
              asset_type: this.assetType,
              notes: this.itemShow.checkin_notes,
              check_datetime: this.itemShow.check_datetime
            };
            break;
          case "license":
            rq = {
              record_id: this.tooShow.record_id,
              asset_type: this.assetType,
              notes: this.itemShow.checkin_notes
            };
            break;
      }
      CheckinProd(rq).then(res => {
        this.$emit("commitData");
      });
    }
  }
};
</script>

<style scoped>

</style>
